<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
 <link th:href ="@{/css/homePage.css}"  rel ="stylesheet" type ="text/css">
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">

<!-- 新 Bootstrap4 核心 CSS 文件 -->
<link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/4.3.1/css/bootstrap.min.css">
 
<!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
<script src="https://cdn.staticfile.org/jquery/3.2.1/jquery.min.js"></script>
 
<!-- bootstrap.bundle.min.js 用于弹窗、提示、下拉菜单，包含了 popper.min.js -->
<script src="https://cdn.staticfile.org/popper.js/1.15.0/umd/popper.min.js"></script>
 
<!-- 最新的 Bootstrap4 核心 JavaScript 文件 -->
<script src="https://cdn.staticfile.org/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script>
 <!--js ui for slider-->
<link rel="stylesheet" href="//apps.bdimg.com/libs/jqueryui/1.10.4/css/jquery-ui.min.css">
  <script src="//apps.bdimg.com/libs/jquery/1.10.2/jquery.min.js"></script>
  <script src="//apps.bdimg.com/libs/jqueryui/1.10.4/jquery-ui.min.js"></script>
 
<script  th:src ="@{/js/login.js}"></script>
<script  th:src ="@{/js/tip_window.js}"></script>
<link th:href ="@{/css/login.css}"  rel ="stylesheet" type ="text/css">
 <link th:href ="@{/css/slider.css}"  rel ="stylesheet" type ="text/css">
<link th:href="@{/css/tip_window.css}" rel="stylesheet" type="text/css">
<link th:href="@{/css/close.css}" rel="stylesheet" type="text/css">
 <link th:href="@{/fontawesome-free-5.11.2-web/css/all.css}" rel="stylesheet" type="text/css">
  <link th:href="@{/fontawesome-free-5.11.2-web/css/v4-shims.css}" rel="stylesheet" type="text/css">
<title>title</title>
</head>

<body>
	<div id="content">
		<div class="login_window_copy" style="display: none;"></div>
		<div class="login_window" style="display: none;">
			<div class="login_title">Login</div>
			<div class="login_change" onclick="to_register()">register</div>
			<div class="login_content"  >
				<div class="inputdiv" id="userdiv">
				<i class="fa fa-child fa-2x"></i>
				<span id ="userspan" class="unactive">Username</span>
				<input id="username" class="input_red" autocomplete="off"  type="text">
				</div>
				<div class="inputdiv" id="passdiv">
				
					<i class="fa fa-key fa-lg"></i>
				<span id="passspan" class="unactive">Password</span>
				<input id="password" class="input_red" autocomplete="off"  type="password">
				</div>
				<div class="inputdiv" id="sliderdiv">
						<i class="fa fa-hand-point-right fa-lg"></i>
					<input id="slider" type="range" min="0" max="100" value="0">
					<label id="slider_label" class="slider_label">
						验证通过
					</label>
				</div>
				<div class="inputdiv" id="buttonidv">
					<button id="login_button" class="login_button login_button_red" onclick="login()">
					确定
					</button>

				</div>
			</div>
			
		</div>
		<div class="login_ani login_ani_hover" id="login_ani"  onclick="login_ani()" >
			GO
		</div>
		<div id="tip_window" class="tip_window tip_show" style="display: none;">
			<div id="tip_close_content" class="tip_close_content"></div>
			<div id="tip_close_div" class="tip_close_div">	
			<button id="tip_close_button" class="tip_close_button  tip_close_button_bottom">
				确定
			</button>
			</div>
		</div>
	</div>
</body>

</html>